<template>
  <div class="overview">
    <cky-card title="关于">
      <div class="c-left">
        Vue3Admin 是基于 Vue3、Vuex、VueRouter、Vite、 ElementPlus
        、TypeScript、Echart5 等后台系统解决方案。
      </div>
    </cky-card>
    <cky-card title="项目结构">
      <div class="c-left">
        <pre>
|-- README.md
|-- babel.config.js
|-- commitlint.config.js
|-- package-lock.json
|-- package.json
|-- public
|   |-- favicon.ico
|   `-- index.html
|-- src
|   |-- App.vue
|   |-- assets
|   |   |-- css
|   |   |   |-- base.css
|   |   |   |-- base.less
|   |   |   |-- index.css
|   |   |   `-- index.less
|   |   `-- img
|   |       |-- avatar.jpg
|   |       |-- login-bg.svg
|   |       `-- logo.svg
|   |-- base-ui
|   |   |-- breadcrumb
|   |   |   |-- index.ts
|   |   |   |-- src
|   |   |   |   `-- BreadCrumb.vue
|   |   |   `-- type
|   |   |       `-- index.ts
|   |   |-- card
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- card.vue
|   |   |-- echart
|   |   |   |-- data
|   |   |   |   `-- china.json
|   |   |   |-- hooks
|   |   |   |   `-- useEchart.ts
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- base-echart.vue
|   |   |-- form
|   |   |   |-- index.ts
|   |   |   |-- src
|   |   |   |   `-- form.vue
|   |   |   `-- type
|   |   |       `-- index.ts
|   |   `-- table
|   |       |-- index.ts
|   |       `-- src
|   |           `-- table.vue
|   |-- components
|   |   |-- nav-header
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- nav-header.vue
|   |   |-- nav-menu
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- nav-menu.vue
|   |   |-- page-content
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- page-content.vue
|   |   |-- page-echarts
|   |   |   |-- index.ts
|   |   |   |-- src
|   |   |   |   |-- bar-echart.vue
|   |   |   |   |-- line-echart.vue
|   |   |   |   |-- map-echart.vue
|   |   |   |   |-- pie-echart.vue
|   |   |   |   `-- rose-echart.vue
|   |   |   |-- type
|   |   |   |   `-- index.ts
|   |   |   `-- untils
|   |   |       |-- convert-data.ts
|   |   |       `-- coordinate-data.ts
|   |   |-- page-modal
|   |   |   |-- index.ts
|   |   |   `-- src
|   |   |       `-- page-modal.vue
|   |   `-- page-search
|   |       |-- index.ts
|   |       `-- src
|   |           `-- page-search.vue
|   |-- global
|   |   |-- index.ts
|   |   |-- register-element.ts
|   |   `-- register-propertise.ts
|   |-- hooks
|   |   |-- use-page-modal.ts
|   |   |-- use-permission.ts
|   |   `-- usePageSearch.ts
|   |-- main.ts
|   |-- router
|   |   |-- index.ts
|   |   `-- main
|   |       |-- analysis
|   |       |   |-- dashboard
|   |       |   |   `-- dashboard.ts
|   |       |   `-- overview
|   |       |       `-- overview.ts
|   |       |-- product
|   |       |   |-- category
|   |       |   |   `-- category.ts
|   |       |   `-- goods
|   |       |       `-- goods.ts
|   |       |-- story
|   |       |   |-- chat
|   |       |   |   `-- chat.ts
|   |       |   `-- list
|   |       |       `-- list.ts
|   |       `-- system
|   |           |-- department
|   |           |   `-- department.ts
|   |           |-- menu
|   |           |   `-- menu.ts
|   |           |-- role
|   |           |   `-- role.ts
|   |           `-- user
|   |               `-- user.ts
|   |-- service
|   |   |-- index.ts
|   |   |-- login
|   |   |   |-- login.ts
|   |   |   `-- type.ts
|   |   |-- main
|   |   |   |-- analysis
|   |   |   |   `-- dashboard.ts
|   |   |   `-- system
|   |   |       `-- system.ts
|   |   `-- request
|   |       |-- config.ts
|   |       |-- index.ts
|   |       `-- type.ts
|   |-- shims-vue.d.ts
|   |-- store
|   |   |-- index.ts
|   |   |-- login
|   |   |   |-- login.ts
|   |   |   `-- type.ts
|   |   |-- main
|   |   |   |-- analysis
|   |   |   |   |-- dashboard.ts
|   |   |   |   `-- types.ts
|   |   |   |-- product
|   |   |   `-- system
|   |   |       |-- system.ts
|   |   |       `-- type.ts
|   |   `-- type.ts
|   |-- untils
|   |   |-- cache.ts
|   |   |-- date-format.ts
|   |   `-- map-menus.ts
|   `-- views
|       |-- login
|       |   |-- config
|       |   |   `-- account-config.ts
|       |   |-- cpns
|       |   |   |-- login-account.vue
|       |   |   |-- login-panel.vue
|       |   |   `-- login-phone.vue
|       |   |-- hooks
|       |   `-- login.vue
|       |-- main
|       |   |-- analysis
|       |   |   |-- dashboard
|       |   |   |   `-- dashboard.vue
|       |   |   `-- overview
|       |   |       `-- overview.vue
|       |   |-- main.vue
|       |   |-- product
|       |   |   |-- category
|       |   |   |   |-- category.vue
|       |   |   |   `-- config
|       |   |   |       |-- contentConfig.ts
|       |   |   |       `-- searchConfig.ts
|       |   |   `-- goods
|       |   |       |-- config
|       |   |       |   `-- contentConfig.ts
|       |   |       `-- goods.vue
|       |   |-- story
|       |   |   |-- chat
|       |   |   |   `-- chat.vue
|       |   |   `-- list
|       |   |       `-- list.vue
|       |   `-- system
|       |       |-- department
|       |       |   `-- department.vue
|       |       |-- menu
|       |       |   |-- config
|       |       |   |   `-- contentConfig.ts
|       |       |   `-- menu.vue
|       |       |-- role
|       |       |   |-- config
|       |       |   |   |-- contentConfig.ts
|       |       |   |   |-- modalConfig.ts
|       |       |   |   `-- searchConfig.ts
|       |       |   `-- role.vue
|       |       `-- user
|       |           |-- config
|       |           |   |-- contentConfig.ts
|       |           |   |-- modalConfig.ts
|       |           |   `-- searchConfig.ts
|       |           `-- user.vue
|       `-- no-found
|           `-- no-found.vue
|-- tsconfig.json
`-- vue.config.js

92 directories, 115 files
        </pre>
      </div>
    </cky-card>
  </div>
</template>

<script lang="ts" setup>
import ckyCard from '@/base-ui/card'
</script>

<style scoped lang="less">
.c-left {
  text-align: left;
}
.el-card {
  margin-bottom: 20px;
  // ::v-deep 重写 element-plus 样式
  &:deep(.el-card__header span) {
    // ::v-deep .el-card__header span {
    font-weight: 700;
  }
}
</style>
